diff options
Diffstat (limited to 'src/routes/[lang=lang]/sections/hero.svelte')
| -rw-r--r-- | src/routes/[lang=lang]/sections/hero.svelte | 61 |
1 files changed, 7 insertions, 54 deletions
diff --git a/src/routes/[lang=lang]/sections/hero.svelte b/src/routes/[lang=lang]/sections/hero.svelte index 3cdf221..8a874dc 100644 --- a/src/routes/[lang=lang]/sections/hero.svelte +++ b/src/routes/[lang=lang]/sections/hero.svelte @@ -1,7 +1,9 @@ <script context="module" lang="ts"> + import type { SanityBlockArray } from "$lib/sanity/types/block-array"; + export type HeroModel = { title: string; - content?: any; + content?: SanityBlockArray; }; </script> @@ -19,57 +21,8 @@ </script> {#if visible} - <section class="has-section-divider-bottom bg-contrast-low/50"> - <div class="py-20 lg:py-32"> - <div class="w-[calc(100%_-_2.5rem)] lg:w-[calc(100%_-_4rem)] mx-auto max-w-lg md:max-w-3xl"> - <div class="text-component"> - <h1>{model.title}</h1> - {#if model.content} - <PortableText value={model.content} /> - {/if} - </div> - </div> - </div> - - <div class="section-divider"> - <svg viewBox="0 0 1920 60" aria-hidden="true"> - <path - class="fill-floor" - d="M-153.5,85.5a4002.033,4002.033,0,0,1,658-71c262.854-6.5,431.675,15.372,600,27,257.356,17.779,624.828,19.31,1089-58v102Z" - /> - </svg> - </div> - </section> + <h1>{model.title}</h1> + {#if model.content} + <PortableText value={model.content} /> + {/if} {/if} - -<style lang="postcss"> - :root { - --section-divider-width: 1920; - --section-divider-height: 60; - --section-divider-ratio: calc(100% * var(--section-divider-height) / var(--section-divider-width)); - } - - [class*="has-section-divider"] { - position: relative; - } - - .has-section-divider-bottom { - padding-bottom: var(--section-divider-ratio); - } - - .section-divider { - position: absolute; - bottom: -1px; - left: 0; - width: 100%; - overflow: hidden; - } - .section-divider svg { - position: relative; - display: block; - height: auto; - max-width: none; - width: 102%; - left: -1%; - } -</style> |
